<template>
  <div class='poamxsdrr display-flex'>
      <div class="left-box">
        <leftMenu></leftMenu>
      </div>
      <div class="zj-context flex-1 bgff ml20 mr20 fdfdxdrt">
          <IntermediateContent></IntermediateContent>
      </div>
      <div class="right-box">
        <rightAttribute></rightAttribute>
      </div>
  </div>
</template>
<script lang='ts' setup>
import 'vue3-draggable-resizable/dist/Vue3DraggableResizable.css'
import Vue3DraggableResizable from "vue3-draggable-resizable";
import { DraggableContainer } from "vue3-draggable-resizable";
import leftMenu from "./components/leftMenu.vue";
import IntermediateContent from "./components/IntermediateContent.vue";
import rightAttribute from "./components/rightAttribute.vue";

</script>
<style scoped>
.poamxsdrr {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #f8f8f8;
  z-index: 9999;
}
.left-box,
.right-box
{
  width: 300px;
  background: #fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
.fdfdxdrt{
  box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
.right-box{

}
</style>